import 'package:flutter/material.dart';
import "package:get/get.dart";

import '../../../components/appbar_widget/appbar_widget.dart';
import '../../../components/loading/svg_loading.dart';
import '../../../components/status/empty.dart';
import '../../../components/status/not_network.dart';
import '../../../components/upload_imgs/upload_imgs.dart';
import '../../../config/global_config.dart';
import '../../../utils/screenutil/fit.dart';
import '../../../utils/tools/Tools.dart';
import 'ctrl/details_ctrl.dart';
import 'typing/divide_upload_type.dart';

class TodoDetails extends StatelessWidget {
  Map<int, dynamic> status = {
    0: '待维保',
    1: '已维保',
    2: '未维保',
  };

  // 导入控制器
  final todoDetailsCtrl = Get.put(DetailsCtrl());

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBarWidget('待办维保').build(context),
      body: Obx(() {
        // 界面数据
        // TodoDetailsBean _data = todoDetailsCtrl.tdData.value;

        // 根据状态返回组件
        if (todoDetailsCtrl.isInitComplete.value) {
          return Container(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                // 无网络描述
                Container(child: NotNetwork()),
                todoDetailsCtrl.MARKSYMBOL.value
                    ? Expanded(
                        child: Container(
                          width: double.infinity,
                          child: Stack(
                            children: [
                              SingleChildScrollView(
                                child: Container(
                                  color: Colors.white,
                                  child: Column(
                                    children: [
                                      createField(
                                        "电梯注册码",
                                        "${todoDetailsCtrl.tdData.value.registerCode}",
                                      ),
                                      createField(
                                        "使用位置",
                                        "${todoDetailsCtrl.tdData.value.villageName}${todoDetailsCtrl.tdData.value.buildingNo}${todoDetailsCtrl.tdData.value.unitNo}${todoDetailsCtrl.tdData.value.shaft}",
                                      ),
                                      createField(
                                        "维保计划时间",
                                        "${Tools.dateFormat(
                                          DateTime.parse(todoDetailsCtrl.tdData
                                              .value.maintenancePlanDate),
                                          DataFormats.y_mo_d,
                                        )}",
                                      ),
                                      uploadImgGroups(
                                        "楼栋门口照片",
                                        DivideUploadType.BUILDING,
                                      ),
                                      uploadImgGroups(
                                        "电梯井照片",
                                        DivideUploadType.ELEVATORSHAFT,
                                      ),
                                      createField(
                                        "维保状态",
                                        "${status[todoDetailsCtrl.tdData.value.status]}",
                                        end: true,
                                      ),
                                    ],
                                  ),
                                ),
                              )
                            ],
                          ),
                        ),
                      )
                    : Expanded(child: Empty()),
                Container(
                  width: 640.f,
                  height: 85.f,
                  child: ElevatedButton(
                    onPressed: () => todoDetailsCtrl.onCompleteTodo(),
                    style: ButtonStyle(
                      backgroundColor:
                          MaterialStateProperty.all(GlobalConfig.theme),
                    ),
                    child: Text("完成维保"),
                  ),
                ),
              ],
            ),
          );
        } else {
          return SVGLoading();
        }
      }),
    );
  }

  // 创建Field
  // * [label] String|标头|必填
  // * [value] dynamic|内容|必填
  Widget createField(String label, dynamic value, {bool end = false}) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.end,
      children: [
        Container(
          padding: EdgeInsets.symmetric(horizontal: 20.f, vertical: 20.f),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Container(
                width: 180.f,
                child: Text(
                  label,
                  style: TextStyle(
                    color: GlobalConfig.assistColor,
                    fontSize: 24.f,
                  ),
                ),
              ),
              Container(
                width: 380.f,
                alignment: Alignment.centerRight,
                child: Text(
                  value ?? '/',
                  style: TextStyle(
                    fontSize: 24.f,
                  ),
                ),
              ),
            ],
          ),
        ),
        SizedBox(
          width: end ? 640.f : 620.f,
          height: 1.f,
          child: Container(
            color: GlobalConfig.borderColor,
          ),
        ),
      ],
    );
  }

  // 创建ImgGroups
  // * [label] String|标头|必填
  // * [value] List|图片地址集合|必填
  Widget uploadImgGroups(String label, DivideUploadType type) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.end,
      children: [
        Container(
          padding: EdgeInsets.symmetric(horizontal: 20.f, vertical: 15.f),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Container(
                width: 180.f,
                child: Text(
                  label,
                  style: TextStyle(
                    color: GlobalConfig.assistColor,
                    fontSize: 24.f,
                  ),
                ),
              ),
              Container(
                width: 380.f,
                child: UploadImgs(
                  onUpLoadResult: (List<String> val) =>
                      todoDetailsCtrl.readUpLoadImgsResult(val, type),
                  onSeeImgs: (int i) => todoDetailsCtrl.reviewImages(i, type),
                ),
              ),
            ],
          ),
        ),
        SizedBox(
          width: 620.f,
          height: 1.f,
          child: Container(
            color: GlobalConfig.borderColor,
          ),
        ),
      ],
    );
  }
}
